import {Button, Form, Input, Space} from 'antd'
import React from 'react'
import {SearchOutlined} from '@ant-design/icons'

// 搜索栏组件
const Search = (props) => {
  const {getData, openModal, ongetSearch} = props
  // 获取表单里面的值
  const [form] = Form.useForm()

  // 搜索按钮
  const searchFormValue = () => {
    console.log(form.getFieldsValue())
    const {name} = form.getFieldsValue()
    ongetSearch(name)
  }

  return (
    <Form className="search" form={form}>
      <Space size="large">
        <Button onClick={() => openModal(true, 2, '添加一级分类')} type='primary' >添加分类</Button>
        <Form.Item label="分类名称" name='name'>
          <Input placeholder="请填写分类名称搜索" suffix={<SearchOutlined onClick={searchFormValue} />} />
        </Form.Item>
      </Space>
    </Form>
  )
}
export default Search